<template>
  <div class="wrapper">
      <div class="content">
          <slot></slot>
      </div>
  </div>
</template>

<script>

import BScroll from "@better-scroll/core";
 
  import observeDOM from '@better-scroll/observe-dom'
  import observeImage from '@better-scroll/observe-image'
export default {
  props:{
    paramInfoOffsetTop:{
      type:Number
    },
    paramInfoOffsetTopHeight:{
      type:Number
    },
    commentInfoOffsetTopHeight:{
      type:Number
    }
  },
    data(){
      return{
        
      }
    },
 mounted(){
    
    BScroll.use(observeDOM)
    BScroll.use(observeImage)
    this.bs=new BScroll('.wrapper',{
      click:true,
      scrollY:true,
      probeType:3,
      observeDOM:true,//监视DOM
      observeImage:true,//监视图像，防止因图片未加载到加载后造成的高度监听不同步
      bounce:true,//回弹效果
    })
    this.bs.on('scroll',position=>{

        if((-position.y)>1400){
        
        this.$emit('isShowBT',true)
      }else{
        
        this.$emit('isShowBT',false)
      }

       if((-position.y)<this.paramInfoOffsetTop){
         this.$emit('navBarScroll',0)
       }else if((-position.y)>=this.paramInfoOffsetTop && (-position.y)<this.paramInfoOffsetTopHeight){
         this.$emit('navBarScroll',1)
       }else if((-position.y)>=this.paramInfoOffsetTopHeight && (-position.y)<this.commentInfoOffsetTopHeight){
         this.$emit('navBarScroll',2)
       }else if((-position.y)>=this.commentInfoOffsetTopHeight){
         this.$emit('navBarScroll',3)
       }
    })
    }
}
</script>

<style scoped>
.wrapper{
    height:calc(100vh - 44px - 58px);
    overflow: hidden;   
}

</style>